<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!-- bootstorp 引入所需css js -->
    <link rel="stylesheet" href="js/bootstrap/bootstrap3/css/bootstrap.css">
    <link rel="stylesheet" href="js/bootstrap/bootstrap3/css/bootstrap-theme.css">
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/bootstrap/bootstrap3/js/bootstrap.js"></script>
    <link rel="stylesheet" href="js/bootstrap/bootstrap-treeview/bootstrap-treeview.min.css">
    <script type="text/javascript" src="js/bootstrap/bootstrap-treeview/bootstrap-treeview.min.js"></script>
    <link rel="stylesheet" href="js/bootstrap/bootStrap-addTabs/bootstrap.addtabs.css">
    <script type="text/javascript" src="js/bootstrap/bootStrap-addTabs/bootstrap.addtabs.min.js"></script>
    <link rel="stylesheet" href="js/bootstrap/bootstrap-table/bootstrap-table.css">
    <script type="text/javascript" src="js/bootstrap/bootstrap-table/bootstrap-table.js"></script>
    <script type="text/javascript" src="js/bootstrap/bootstrap-table/locale/bootstrap-table-zh-CN.js"></script>
    <script type="text/javascript" src="js/bootstrap/bootstrap-bootbox/bootbox.js"></script>
    <link rel="stylesheet" href="js/bootstrap/bootstrap-datetimepicker/css/bootstrap-datetimepicker.css"></link>
    <script type="text/javascript" src="js/bootstrap/bootstrap-datetimepicker/js/bootstrap-datetimepicker.js"></script>
    <script type="text/javascript" src="js/bootstrap/bootstrap-datetimepicker/js/locales/bootstrap-datetimepicker.zh-CN.js"></script>
    <link rel="stylesheet" href="js/bootstrap/bootstrap-fileinput/css/fileinput.css"></link>
    <script type="text/javascript" src="js/bootstrap/bootstrap-fileinput/js/fileinput.js"></script>
    <script type="text/javascript" src="js/bootstrap/bootstrap-fileinput/js/locales/zh.js"></script>
    <link rel="stylesheet" href="js/bootstrap/bootstrap-switch-master/dist/css/bootstrap3/bootstrap-switch.css"></link>
    <link rel="stylesheet" href="js/bootstrap.min.css">
    <link href="js/app.css" rel="stylesheet">
</head>
<body>
    <div id="paid"></div>
</body>
<script>
    $(function(){
        initUserList();
    })
    function initUserList() {
        $('#paid').bootstrapTable({
            url:'http://127.0.0.1:8085/order/queryOrderEnd',
            pagination:false, //是否展示分页
            pageList:[1,3,5],//分页组件
            pageNumber:1,
            pageSize:2,//默认每页条数
            //search:true,//是否显示搜索框
            //searchText:'试试',//初始化搜索文字
            showColumns:false,//是否显示 内容列下拉框
            showToggle:false,//是否显示 切换视图（table/card）按钮
            showPaginationSwitch:false,//是否显示 数据条数选择框
            showRefresh:false,//是否显示刷新按钮
            detailView:false,//设置为 true 可以显示详细页面模式。
            showFooter:false,//是否显示列脚
            clickToSelect: true, //是否启用点击选中行
            sidePagination:'client',//分页方式：client客户端分页，server服务端分页（*
            striped:true,
            queryParams:function(){
                return {
                    page: this.pageNumber,
                    rows: this.pageSize
                };
            },
            columns:[{checkbox:true},//是否显示复选框
                {field:"ordernumber",title:"订单号",align:'center',width:150},
                {field:"areaname",title:"景点",align:'center',width:150},
                {field:"traveltime",title:"行程日期",align:'center',width:150},
                {field:"phone",title:"电话",align:'center',width:150},
                {field:"email",title:"邮箱",align:'center',width:150},
                {field:"totalprice",title:"票价",align:'center',width:150},
                {field:"creationtime",title:"购票时间",align:'center',width:150},
                /*{field:'caozuo',title:'操作',width:100,formatter:function(value,row,index){
                        var str="";
                        str+="<a href='javascript:del("+row.id+")'>删除</a>" //row拿所有属性
                        str+="<a href='javascript:updateUser("+row.id+")'>修改</a>"//row拿所有属性
                        return str;
                    }
                },*/
            ]
        });
    }
</script>
</html>